<template>
<view class="flex flex-wrap article">
<!-- 	<view class="cu-bar bg-white solid-bottom">
		<view class="action">
			<view class="icon-titles text-red"></view>
			文章列表
		</view>
	</view> -->
	<view class="cu-card case no-card" v-for="item in list" :key="item.id" @tap="toRead(item)">
		<view class="cu-item">
			<view class="image">
				<image :src="item.img_url"></image>
				<view class="cu-tag bg-brown" v-if="item.is_pay">售价:<text class="text-price">{{ item.pay_price }}</text></view>
				<view class="cu-bar bg-shadeBottom"> <text class="text-cut">{{ item.title }}</text></view>
			</view>
<!-- 			<view class="cu-list menu-avatar">
				<view class="cu-item">
					<view class="cu-avatar round lg" :style="{backgroundImage:'url('+item.img_url+')'}"></view>
					<view class="content flex-sub">
						<view class="text-grey">{{ item.title }}</view>
						<view class="text-gray text-sm flex justify-between">
							<view></view>
							<view class="text-gray text-sm">
								<text class="icon-attentionfill margin-lr-xs"></text> 10
								<text class="icon-appreciatefill margin-lr-xs"></text> 20
								<text class="icon-messagefill margin-lr-xs"></text> 30
							</view>
						</view>
					</view>
				</view>
			</view> -->
		</view>
	</view>
	<pay-list @close-pay="show = false" :show="show" :divFun="0" @myPay="toPay"></pay-list>
</view>
</template>

<script>
	import { uAtricleList } from '@/common/api'
	import { videoPay, payMoney } from '@/common/api/shop'
	import PayList from '@/components/payList'
	import { mapGetters } from 'vuex'
	export default {
		name: 'articleList',
		data () {
			return {
				list: [],
				show: false,
				batchcode: '',
				article: {}				
			}
		},
		props: {
			way: {
				type: Number,
				default: 0
			}
		},
		created () {
			this.getList()
		},
		computed: {
			...mapGetters(['userInfo'])
		},
		components: { PayList },
		methods: {
			getList () {
				uni.showLoading()
				uAtricleList({appid: this.$appid}).then(res => {
					uni.hideLoading()
					if (!res.code) this.list = res.data
				})
			},
			toPay (pay) {
				uni.showLoading({ title: '支付中', mask: true })
				let px = {
						total_price: this.article.pay_price,
						batchcode: this.batchcode,					
				}
				let params = {}
				if (pay.pay_id == 3) {
						params = {
							appid: this.$appid,
							...px,
							...pay
							}
					} else {
						params = {
							...px,
							...pay
						}
					}
				payMoney(params).then(res => {
					uni.hideLoading()
					if (!res.code) {
						if (pay.pay_id === 3) {
							uni.showToast({
								title: '支付成功',
								success: () => {
									setTimeout(() => {
										this.article.is_pay = 0
										this.show = false
									}, 1500)
								}
							})
						} else if (pay.pay_id === 4 || pay.pay_id === 5) {
						 let provider = ''
						 pay.pay_id === 4 ? provider = 'wxpay' : provider = 'alipay'
						 // #ifndef MP-WEIXIN
						 uni.requestPayment({
							 provider: provider,
							 orderInfo: res.data,
							success: (res) => {
								uni.showToast({
									title: '支付成功',
									success: () => {
										setTimeout(() => {
											this.article.is_pay = 0
											this.show = false
										}, 1500)
									}
								})
							},
							fail: err => {
								console.log(JSON.stringify(err))
							}
						 })							 
						 // #endif
						 // #ifdef MP-WEIXIN
						 uni.requestPayment({
							 provider,
							 ...res.data,
							 success: r => {
								uni.showToast({
									title: '支付成功',
									success: () => {
										setTimeout(() => {
											this.article.is_pay = 0
											this.show = false
										}, 1500)
									}
								})
							 },
							 fail: er => {
								 console.log(er)
							 }
						 });
						 // #endif						 
					}
					} else {
						uni.showModal({
							content: res.code,
							showCancel:false
						})
					}
				})
			},
			toRead (item) {
				if (!this.way) {
					this.article = item
					if (item.is_pay) {
						let params = {
							type: 2,
							appid: this.$appid,
							pid: item.id,
							price: item.pay_price
						}
						uni.showLoading()
						videoPay(params).then(res => {
							uni.hideLoading()
							if (!res.code) {						
								this.batchcode = res.batchcode
								this.show = true							
							} else {
								uni.showToast({
									title: '订单创建失败',
									icon: 'none'
								})
							}
						})
					} else {
						uni.navigateTo({
							url: `/shop/articleDetail?id=${this.article.id}`
						})
					}					
				} else {
					uni.navigateTo({
						url: '/shop/article'
					})
				}
			}
		}
	}
</script>

<style lang="less">
	.case {
		width: 50%;
		image {
			height: 190upx;
		}		
	}
</style>
